﻿<UserControl x:Class="EventToCommand.MainPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras"
             mc:Ignorable="d"
             DataContext="{Binding Main, Source={StaticResource Locator}}"
             MinWidth="500"
             MinHeight="500">

    <UserControl.Resources>
        <GridLength x:Key="NormalRowHeight">60</GridLength>
        <GridLength x:Key="ParameterRowHeight">30</GridLength>

        <LinearGradientBrush x:Key="BackgroundBrush"
                             EndPoint="1.067,1.347"
                             StartPoint="0.16,-0.129">
            <GradientStop Color="#FF9DAEE4"
                          Offset="0" />
            <GradientStop Color="White"
                          Offset="1" />
        </LinearGradientBrush>

        <ControlTemplate x:Key="ButtonTemplate"
                         TargetType="Button">
            <Grid x:Name="Root"
                  Opacity="0.8"
                  RenderTransformOrigin="0.5,0.5">
                <Grid.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform />
                        <SkewTransform />
                        <RotateTransform />
                        <TranslateTransform />
                    </TransformGroup>
                </Grid.RenderTransform>

                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualStateGroup.Transitions>
                            <VisualTransition From="MouseOver"
                                              GeneratedDuration="00:00:00.2000000"
                                              To="Normal" />
                            <VisualTransition From="Normal"
                                              GeneratedDuration="00:00:00.2000000"
                                              To="MouseOver" />
                        </VisualStateGroup.Transitions>
                        <VisualState x:Name="Normal" />
                        <VisualState x:Name="MouseOver">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                               Duration="00:00:00.0010000"
                                                               Storyboard.TargetName="Root"
                                                               Storyboard.TargetProperty="(UIElement.Opacity)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00"
                                                          Value="1" />
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="Pressed">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                               Duration="00:00:00.0010000"
                                                               Storyboard.TargetName="Root"
                                                               Storyboard.TargetProperty="(UIElement.Opacity)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00"
                                                          Value="1" />
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                               Duration="00:00:00.0010000"
                                                               Storyboard.TargetName="Root"
                                                               Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00"
                                                          Value="0.9" />
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                               Duration="00:00:00.0010000"
                                                               Storyboard.TargetName="Root"
                                                               Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00"
                                                          Value="0.9" />
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="Disabled">
                            <Storyboard>
                                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                               Duration="00:00:00.0010000"
                                                               Storyboard.TargetName="Root"
                                                               Storyboard.TargetProperty="(UIElement.Opacity)">
                                    <SplineDoubleKeyFrame KeyTime="00:00:00"
                                                          Value="0.4" />
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>

                <Rectangle Fill="{TemplateBinding Background}"
                           Stroke="Black"
                           RadiusX="8"
                           RadiusY="8" />
                <TextBlock HorizontalAlignment="Center"
                           VerticalAlignment="Center"
                           Text="{TemplateBinding Content}"
                           TextWrapping="Wrap"
                           FontSize="16"
                           FontWeight="Bold" />
            </Grid>
        </ControlTemplate>

        <Style x:Key="ButtonStyle"
               TargetType="Button">
            <Setter Property="Template"
                    Value="{StaticResource ButtonTemplate}" />
            <Setter Property="Cursor"
                    Value="Hand" />
        </Style>
    </UserControl.Resources>

    <Border Background="{StaticResource BackgroundBrush}">

        <Grid Margin="10,0,10,10">
            <Grid.RowDefinitions>
                <RowDefinition Height="{StaticResource NormalRowHeight}" />
                <RowDefinition Height="{StaticResource NormalRowHeight}" />
                <RowDefinition Height="{StaticResource NormalRowHeight}" />
                <RowDefinition Height="{StaticResource ParameterRowHeight}" />
                <RowDefinition Height="{StaticResource NormalRowHeight}" />
                <RowDefinition Height="{StaticResource NormalRowHeight}" />
                <RowDefinition Height="{StaticResource ParameterRowHeight}" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="300" />
                <ColumnDefinition Width="200" />
            </Grid.ColumnDefinitions>

            <TextBlock HorizontalAlignment="Center"
                       Margin="10,0"
                       VerticalAlignment="Center"
                       FontSize="16"
                       FontStyle="Italic"
                       FontWeight="Bold"
                       Foreground="{Binding LastUsedBrush}"
                       Text="{Binding Status}"
                       TextWrapping="Wrap"
                       Grid.ColumnSpan="3" />

            <TextBox x:Name="ParameterTextBox"
                     Margin="40,0"
                     FontSize="14"
                     HorizontalContentAlignment="Center"
                     VerticalContentAlignment="Center"
                     Grid.ColumnSpan="3"
                     Grid.Row="3"
                     Text="Parameter for the command" />

            <Button Background="{Binding Brushes.Brush1}"
                    Margin="10"
                    Style="{StaticResource ButtonStyle}"
                    Content="Simple Command"
                    Grid.Row="1"
                    ToolTipService.ToolTip="Click to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <cmd:EventToCommand Command="{Binding SimpleCommand}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Button>

            <Rectangle Fill="{Binding Brushes.Brush1}"
                       Stroke="Black"
                       Margin="10"
                       Grid.Column="1"
                       Grid.Row="1"
                       ToolTipService.ToolTip="MouseOver to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseEnter">
                        <cmd:EventToCommand Command="{Binding SimpleCommand}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Rectangle>

            <Button Background="{Binding Brushes.Brush2}"
                    Margin="10"
                    Style="{StaticResource ButtonStyle}"
                    Content="Parameter Command (bound)"
                    Grid.Row="2"
                    ToolTipService.ToolTip="Click to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <cmd:EventToCommand Command="{Binding ParameterCommand1}"
                                            CommandParameter="{Binding Text, ElementName=ParameterTextBox}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Button>

            <Rectangle Fill="{Binding Brushes.Brush2}"
                       Stroke="Black"
                       Margin="10"
                       Grid.Column="1"
                       Grid.Row="2"
                       ToolTipService.ToolTip="MouseOver to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseEnter">
                        <cmd:EventToCommand Command="{Binding ParameterCommand1}"
                                            CommandParameter="{Binding Text, ElementName=ParameterTextBox}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Rectangle>

            <Button Background="{Binding Brushes.Brush3}"
                    Margin="10"
                    Style="{StaticResource ButtonStyle}"
                    Content="Parameter Command (Hello)"
                    Grid.Row="4"
                    ToolTipService.ToolTip="Click to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <cmd:EventToCommand Command="{Binding ParameterCommand2}"
                                            CommandParameterValue="Hello" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Button>

            <Rectangle Fill="{Binding Brushes.Brush3}"
                       Stroke="Black"
                       Margin="10"
                       Grid.Column="1"
                       Grid.Row="4"
                       ToolTipService.ToolTip="MouseOver to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseEnter">
                        <cmd:EventToCommand Command="{Binding ParameterCommand2}"
                                            CommandParameterValue="Hello" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Rectangle>

            <Button Background="{Binding Brushes.Brush4}"
                    Margin="10"
                    Style="{StaticResource ButtonStyle}"
                    Content="&quot;Disablable&quot; Command"
                    Grid.Row="5"
                    ToolTipService.ToolTip="Click to activate command">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <cmd:EventToCommand Command="{Binding DisablableCommand}"
                                            CommandParameter="{Binding Text, ElementName=DisableCommandTextBox}"
                                            MustToggleIsEnabled="{Binding IsChecked, ElementName=MustToggleCheckBox}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Button>

            <Rectangle Fill="{Binding Brushes.Brush4}"
                       Stroke="Black"
                       Margin="10"
                       Grid.Column="1"
                       Grid.Row="5"
                       ToolTipService.ToolTip="Rectangles can also be disabled in WPF">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseEnter">
                        <cmd:EventToCommand Command="{Binding DisablableCommand}"
                                            CommandParameter="{Binding Text, ElementName=DisableCommandTextBox}"
                                            MustToggleIsEnabled="{Binding IsChecked, ElementName=MustToggleCheckBox}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Rectangle>

            <TextBox x:Name="DisableCommandTextBox"
                     Margin="40,0,0,0"
                     FontSize="14"
                     HorizontalContentAlignment="Center"
                     VerticalContentAlignment="Center"
                     Grid.Row="6"
                     Text="Enter the word &quot;Hello&quot; to disable" />

            <CheckBox x:Name="MustToggleCheckBox"
                      Content="Allow toggling IsEnabled"
                      Grid.Column="1"
                      Grid.Row="6"
                      FontSize="12"
                      VerticalAlignment="Center"
                      Margin="10,0,0,0"
                      IsChecked="True"
                      Grid.ColumnSpan="2" />
            <Ellipse Fill="{Binding Brushes.Brush5}"
                     Stroke="Black"
                     Margin="10,8"
                     Grid.ColumnSpan="2"
                     Grid.Row="7">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="MouseMove">
                        <cmd:EventToCommand PassEventArgsToCommand="True"
                                            Command="{Binding MoveMouseCommand}" />
                    </i:EventTrigger>
                    <i:EventTrigger EventName="MouseLeave">
                        <cmd:EventToCommand Command="{Binding ResetCommand}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </Ellipse>
            
            <TextBlock HorizontalAlignment="Center"
                       Text="With EventArgs (Move the mouse)"
                       TextWrapping="Wrap"
                       Grid.Row="7"
                       Grid.ColumnSpan="2"
                       VerticalAlignment="Center"
                       FontSize="20"
                       FontWeight="Bold"
                       IsHitTestVisible="False" />
        </Grid>
    </Border>
</UserControl>
